<template>
	<view>
		<view class="header">
			<u-navbar
				:background="{ backgroundColor: '#3478F2' }"
				back-icon-color="#fff"
				back-icon-name="arrow-left"
				back-icon-size="40"
				title="我的资料"
				title-color="#fff"
				title-size="40"
				title-bold
			></u-navbar>
		</view>
		<scroll-view scroll-top="0" scroll-y="true" :style="`height:${scrollHeight}px`">
			<view class="page" v-if="auth">
				<view class="top">
					<view class="top_content">
						<view class="top_text">借款需求</view>
						<view class="line"></view>
						<view class="top_money">{{ money }}</view>
					</view>
				</view>
				<view class="tip">实名信息</view>
				<view class="content">
					<view class="con_item">
						<text class="con_left">真实姓名</text>
						<text class="con_right">{{ authData.name }}</text>
					</view>
					<view class="con_item">
						<text class="con_left">身份证号</text>
						<text class="con_right">{{ authData.idcard }}</text>
					</view>
					<view class="con_item">
						<text class="con_left">常住地</text>
						<text class="con_right">{{ authData.region }}</text>
					</view>
					<view class="con_item">
						<text class="con_left">职业信息</text>
						<text class="con_right">{{ authData.vocation }}</text>
					</view>
					<view class="con_item" v-for="(item, index) in authData.vocation_other" :key="index">
						<text class="con_left">{{ item.label }}</text>
						<text class="con_right">{{ item.name }}</text>
					</view>
				</view>
				<view class="tip">资质信息</view>
				<view class="content" v-if="!noAptitude">
					<view class="con_item">
						<text class="con_left">社保缴纳</text>
						<text class="con_right">{{ aptData.social }}</text>
					</view>
					<view class="con_item">
						<text class="con_left">公积金缴纳</text>
						<text class="con_right">{{ aptData.gjj }}</text>
					</view>
					<view class="con_item">
						<text class="con_left">房产情况</text>
						<text class="con_right">{{ aptData.room }}</text>
					</view>
					<view class="con_item">
						<text class="con_left">车辆情况</text>
						<text class="con_right">{{ aptData.car }}</text>
					</view>
					<view class="con_item">
						<text class="con_left">保险保单</text>
						<text class="con_right">{{ aptData.policy }}</text>
					</view>
					<view class="con_item">
						<text class="con_left">芝麻分</text>
						<text class="con_right">{{ aptData.sesame }}</text>
					</view>
					<view class="con_item">
						<text class="con_left">信用卡</text>
						<text class="con_right">{{ aptData.credit_card }}</text>
					</view>
					<view class="con_item">
						<text class="con_left">京东白条</text>
						<text class="con_right">{{ aptData.baitiao }}</text>
					</view>
					<view class="con_item">
						<text class="con_left">花呗</text>
						<text class="con_right">{{ aptData.huabei }}</text>
					</view>
				</view>
				<view class="bottom" v-if="noAptitude">
					资质信息还未填写，可能会影响您贷款额度，记得
					<text class="addData" @click="addData">去填写</text>
					噢~ ~
				</view>
			</view>
			<view class="page1" v-else>
				<text>您还没有完整填写资料</text>
				<view class="color">
					<text v-if="goWhere == 1" @click="addAuth">现在去填写</text>
					<text v-if="goWhere == 2" @click="addAll">现在去填写</text>
					<image src="/static/icon/right.png" mode="scaleToFill" />
				</view>
				<view class="line1"></view>
			</view>
		</scroll-view>
	</view>
</template>
<script>
import { mixin } from '@/utils/mixins'
import api from '@/api'
export default {
	mixins: [mixin],
	components: {},
	data() {
		return {
			noAptitude: false,
			auth: true,
			goWhere: 1,
			authData: '',
			aptData: '',
			money: ''
		}
	},
	computed: {},
	watch: {},
	onLoad() {
		this.getUserInfo()
	},
	onShow() {},
	onReady() {},
	// 方法集合
	methods: {
		async getUserInfo() {
			try {
				const res = await api.myData({})
				console.log(res)
				// res.operation_type = 0
				if (res.operation_type == 3) {
					this.money = res.money
					this.authData = res.certification
					this.aptData = res.intelligence
				}
				if (res.operation_type == 2) {
					this.money = res.money
					this.authData = res.certification
					this.noAptitude = true
				}
				if (res.operation_type == 1) {
					this.auth = false
				}
				if (res.operation_type == 0) {
					this.auth = false
					this.goWhere = 2
				}
			} catch (error) {
				console.log(error)
			}
		},
		addData() {
			uni.navigateTo({
				url: '/pages/auth/asset'
			})
		},
		addAuth() {
			uni.navigateTo({
				url: '/pages/auth/shiming'
			})
		},
		addAll() {
			uni.navigateTo({
				url: '/pages/auth/demand'
			})
		}
	},
	onHide() {},
	onUnload() {}
}
</script>

<style lang="scss" scoped>
.page {
	background-color: #fff;
}
.top {
	padding: 40rpx 32rpx;
	border-top: 2rpx solid #d7d7d7;
	.top_content {
		width: 686rpx;
		height: 200rpx;
		background: linear-gradient(180deg, #0481fe 0%, #40c5fe 100%);
		box-shadow: 0px 6px 12px rgba(11, 137, 254, 0.08);
		border-radius: 16px;
		padding: 24rpx;
		color: #ffffff;
		font-family: PingFang SC;
		.top_text {
			font-size: 32rpx;
			font-weight: bold;
			padding-bottom: 16rpx;
		}
		.line {
			margin-top: 5rpx;
			width: 100%;
			height: 1px;
			background-image: linear-gradient(to right, #fff 0%, #fff 50%, transparent 50%);
			background-size: 8px 1px;
			background-repeat: repeat-x;
			margin-bottom: 20rpx;
		}
		.top_money {
			font-size: 52rpx;
			font-family: PingFang SC;
			font-weight: 800;
			line-height: 74rpx;
		}
	}
}
.tip {
	width: 100vw;
	height: 60rpx;
	background: #ecf5ff;
	color: #0780fe;
	font-size: 32rpx;
	font-family: PingFang SC;
	font-weight: bold;
	text-align: center;
	line-height: 60rpx;
}
.content {
	padding: 0 32rpx 40rpx 32rpx;
	.con_item {
		padding: 0 24rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 28rpx;
		font-family: PingFang SC;
		border-bottom: 2rpx solid #f3f3f3;
		height: 106rpx;
		.con_left {
			font-weight: 400;
			color: #969799;
		}
		.con_right {
			font-weight: bold;
			color: #333333;
		}
	}
}
.bottom {
	height: 252rpx;
	padding: 68rpx 56rpx;
	text-align: center;
	font-size: 32rpx;
	font-family: PingFang SC;
	font-weight: 400;
	color: #6f768b;
	line-height: 44rpx;
}
.addData {
	color: #0780fe;
}
.page1 {
	height: 100vh;
	background-color: #fff;
	padding: 394rpx 214rpx;
	text-align: center;
	font-size: 32rpx;
	font-family: PingFang SC;
	font-weight: 400;
	color: #333333;
	line-height: 44rpx;
	.color {
		// width: 320rpx;
		color: #3478f2;
		display: flex;
		align-items: center;
		justify-content: center;
		image {
			width: 27rpx;
			height: 21rpx;
		}
	}
	.line1 {
		height: 2rpx;
		width: 188rpx;
		background: #3478f2;
		margin: 0 auto;
	}
}
</style>
